<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:c="http://java.sun.com/jstl/core"
                xmlns:sf="http://www.springframework.org/tags/faces"
                xmlns:a4j="http://richfaces.org/a4j"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:rich="http://richfaces.org/rich"
                xmlns:spring="http://www.springframework.org/tags"
                template="../../../layout/Template.xhtml">


    <ui:define name="menu">
        <ui:include src="${user.menu}"/>
    </ui:define>

    <ui:define name="title">
        <h:outputText value="#{resourceBundle.createLessonWelcome}"/>
    </ui:define>

    <ui:define name="content">
        <ui:fragment id="createLessonFragment">
            <rich:panel id="createLessonPanel"
                        header="#{resourceBundle.createLessonWelcome}">
                <h:form id="createLessonForm">
                    <h:panelGrid id="createLessonGrid" columns="3">
                        <h:outputText value="#{resourceBundle.createLessonFormSubject} : "/>
                        <h:inputText value="#{viewScope.createdLesson.subject}"
                                     id="subject" required="true"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageSubject}"/>
                        <h:message for="subject" style="color:red"/>

                        <h:outputText value="#{resourceBundle.createLessonFormContain} : "/>
                        <rich:editor value="#{viewScope.createdLesson.contain}"
                                     id="contain" required="true" theme="advanced"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageContain}">
                            <f:param name="theme_advanced_toolbar_location" value="top"/>
                            <f:param name="theme_advanced_toolbar_align" value="left"/>
                        </rich:editor>
                        <h:message for="contain" style="color:red"/>

                        <h:outputText
                                value="#{resourceBundle.createLessonFormLinkSupport} : "/>
                        <h:inputText value="#{viewScope.createdLesson.linkSupport}"
                                     id="linkSupport" required="true"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageLinkSupport}"/>
                        <h:message for="linkSupport" style="color:red"/>

                        <h:outputText
                                value="#{resourceBundle.createLessonFormStartTime} : "/>
                        <h:inputText value="#{viewScope.createdLesson.startTime}"
                                     id="startTime" required="true"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageStartTime}"
                                     converterMessage="#{resourceBundle.createLessonConverterMessageStartTime}">
                            <f:convertDateTime pattern="HH:mm" type="time"/>
                        </h:inputText>
                        <h:message for="startTime" style="color:red"/>

                        <h:outputText value="#{resourceBundle.createLessonFormEndTime} : "/>
                        <h:inputText value="#{viewScope.createdLesson.endTime}"
                                     id="endTime" required="true"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageEndTime}"
                                     converterMessage="#{resourceBundle.createLessonConverterMessageEndTime}">
                            <f:convertDateTime pattern="HH:mm" type="time"/>
                        </h:inputText>
                        <h:message for="endTime" style="color:red"/>

                        <h:outputText value="#{resourceBundle.createLessonFormDate} : "/>
                        <h:inputText value="#{viewScope.createdLesson.date}" id="date"
                                     required="true"
                                     requiredMessage="#{resourceBundle.createLessonRequiredMessageDate}"
                                     converterMessage="#{resourceBundle.createLessonConverterMessageDate}">
                            <f:convertDateTime pattern="dd/MM/yy" type="date"/>
                        </h:inputText>
                        <h:message for="date" style="color:red"/>
                    </h:panelGrid>

                    <h:panelGrid columns="2" columnClasses="uploadItem, uploadItem"
                                 styleClass="uploadGroup">
                        <rich:fileUpload id="listLessonUpload"
                                         acceptedTypes="jpg, gif, png, bmp, pdf"
                                         maxFilesQuantity="#{fileUploadBean.uploadsAvailable}"
                                         immediateUpload="#{fileUploadBean.autoUpload}"
                                         allowFlash="#{fileUploadBean.useFlash}"
                                         fileUploadListener="#{fileUploadBean.listener}">
                        </rich:fileUpload>

                        <h:panelGroup id="info">
                            <rich:panel bodyClass="info">
                                <f:facet name="header">
                                    <h:outputText
                                            value="#{resourceBundle.createLessonUploadedFilesInfo}"/>
                                </f:facet>
                                <h:outputText
                                        value="#{resourceBundle.createLessonNoFilesCurrentlyUploaded}"
                                        rendered="#{fileUploadBean.size==0}"/>
                                <rich:dataGrid columns="1"
                                               value="#{fileUploadBean.filesUploaded}" var="file"
                                               rowKeyVar="row">
                                    <rich:panel>
                                        <h:panelGrid columns="2">
                                            <!--<a4j:mediaOutput element="img" mimeType="#{file.mime}"
                                                           createContent="#{fileUploadBean.paint}" value="#{row}"
                                                           style="width:100px; height:100px;" cacheable="false">
                                                           <f:param value="#{fileUploadBean.timeStamp}" name="time" />
                                                       </a4j:mediaOutput>
                                                       --><h:panelGrid columns="2">
                                            <h:outputText
                                                    value="#{resourceBundle.createLessonFileName}:"/>
                                            <h:outputText value="#{file.name}"/>
                                            <h:outputText
                                                    value="#{resourceBundle.createLessonFileLength}:"/>
                                            <h:outputText value="#{file.length}"/>
                                        </h:panelGrid>
                                        </h:panelGrid>
                                    </rich:panel>
                                </rich:dataGrid>
                            </rich:panel>
                            <rich:spacer height="3"/>
                            <br/>
                            <a4j:commandButton action="#{fileUploadBean.clearUploadData}"
                                               reRender="info"
                                               value="#{resourceBundle.createLessonClearUploadedData}"
                                               rendered="#{fileUploadBean.size>0}"/>
                        </h:panelGroup>
                    </h:panelGrid>

                    <h:messages globalOnly="true"/>

                    <a4j:commandButton type="submit" value="#{bundle.addButton}"
                                       action="add"/>
                    <a4j:commandButton value="#{bundle.cancelButton}" action="cancel"
                                       immediate="true"/>
                </h:form>
            </rich:panel>
        </ui:fragment>
    </ui:define>

</ui:composition>